<template>
    <rx-dialog @handOk="handOk" @cancel="cancel">
        <rx-layout>
            <div slot="center">
                <rx-monacoeditor ref="monacoes"
                                 class="monacoBox"
                                 :language="language"
                                 v-model="localVal">
                    <template v-slot:monacoeditor>
<!--                        <a-select id="fieldType" v-model="fieldType" style="width: 20%" @change="constChangeType" allowClear>
                            <a-select-option v-for="item in constList" :key="item.id" :value="item.id">{{item.value}}
                            </a-select-option>
                        </a-select>-->
                        <a-dropdown>
                            <a-menu slot="overlay" >
                                <a-menu-item v-for="item in constList" key="item.id" @click="handleMenuClick(item)"> <a-icon type="user" />{{item.value}} </a-menu-item>
                            </a-menu>
                            <a-button style="margin-left: 8px"> {{i18n("insertScript","插入脚本")}} <a-icon type="down" /> </a-button>
                        </a-dropdown>
                        <a-dropdown>
                            <a-menu slot="overlay" >
                                <a-menu-item v-for="item in userConstant" key="item.id" @click="handleUserConstant(item)"> <a-icon type="user" />{{item.value}} </a-menu-item>
                            </a-menu>
                            <a-button style="margin-left: 8px">{{i18n("insertConstant","插入用户常量")}}  <a-icon type="down" /> </a-button>
                        </a-dropdown>
                    </template>

                </rx-monacoeditor>
            </div>
        </rx-layout>
    </rx-dialog>
</template>

<script>
import {Util,RxLayout,RxDialog,RxFit,RxMonacoEditor,Dialog,JsConstant} from "@lowcode/jpaas-common-lib"
import RxProcessHandleDialog   from './rx-process-handle-dialog';
import DialogBox from "@/assets/js/DialogBox";
import CustomViewDialog from "@/views/modules/form/core/dialog/CustomViewDialog.vue";

export default {
    name: 'PortalJSMonacoEdit',
    components: {
        RxProcessHandleDialog,
        RxLayout,
        RxDialog,
        RxMonacoEditor

    },
    props:{
        layerid: {
            type: String,
            default: ""
        },
        destroy: {
            type: Function
        },
        monacoValue:{
            type: String,
            default: ""
        },
        /**
         * 属性列表。
         */
        attrList: {
            type: Array,
            default: []
        },
        /**
         * 语言。
         */
        language:{
            type: String,
            default: "javascript"
        },
        appId:{
            type: String,
            default: ""
        },

    },
    data() {
        return {

            localVal:"",
            fieldType:"",
            constList:[
                {id:"openForm",value: this.i18n("openForm","打开表单方案")},
                {id:"openList",value: this.i18n("openList","打开列表")},
                {id:"openCustomPage",value: this.i18n("openCustomPage","打开页面定制")}
            ],
            userConstant:[
                {id:"userId",value: this.i18n("userId","当前用户Id")},
                {id:"fullName",value: this.i18n("fullName","当前用户名")},
                {id:"account",value: this.i18n("account","当前用户账号")},
                {id:"deptId",value: this.i18n("deptId","用户主部门Id")},
                {id:"deptName",value: this.i18n("deptName","用户主部门名称")},
                {id:"groupIds",value: this.i18n("roles","当前用户所在组id")},
            ]
        }
    },
    created(){
        this.localVal=this.monacoValue;
    },
    methods: {
        i18n(name,text,key){
            return this.$ti18(name,text,"PortalJsMonaco",key);
        },
        constChangeType(){
            if (!this.fieldType){
                return
            }
            let method = 'this.func_'+this.fieldType+"()";
            eval(method)
        },
        func_openForm(name,alias,appId){
            let script='let config={\n' +
                '   title:"'+name+'",\n' +
                '    routeName:"CustomForm",\n' +
                '    alias:"'+alias+'",\n' +
                '    appId:"'+appId+'"\n' +
                '}\n' +
                'this.portalJump(config)'
            this.$refs.monacoes.insertContent (script)
        },
        func_openList(name,key,appId){
            let script="let config={\n" +
                "   title:'"+name+"',\n" +
                "   key:'"+key+"',\n" +
                "   routeName:'CustomList',\n" +
                "   appId:'"+appId+"',\n" +
                "}\n" +
                "this.portalJump(config)"
            this.$refs.monacoes.insertContent (script)
        },
        func_openCustomPage(name,alias,appId){
            let script='let config={\n' +
                '   title:"'+name+'",\n' +
                '   routeName:"customView",\n' +
                '   alias:"'+alias+'",\n' +
                '   appId:"'+appId+'"\n' +
                '}\n' +
                'this.portalJump(config)'
            this.$refs.monacoes.insertContent (script)
        },
        handleMenuClick(item){
            if (!item){
                return
            }
            eval("this."+item.id+"()")
        },
        handleUserConstant(item){
            //插入用户变量
            if (!item){
                return
            }
            let script="this.curUser."+item.id
            this.$refs.monacoes.insertContent (script)
        },
        openForm(config){
            var config={
                curVm: this,
                data:{multiSelect:false},
                widthHeight: ['800px', '600px'],
                cancel:function () {

                }
            }
            if (this.appId){
                config.data.appId=this.appId
            }
            var self=this
            DialogBox.openSoution(config,
                function (data) {
                    var item = data

                    self.func_openForm(item.name,item.alias,self.appId)
                }
            )
        },

        openList(config){
            var config={
                data:{isDialog: 'NO'},
                curVm: this,
                widthHeight: ['800px', '600px']
            }
            if (this.appId){
                config.data.queryAppId=this.appId
            }
            var self=this
            Dialog.openFormBoListDialog(config,
                function (vm, data) {
                    var item = data[0];

                    self.func_openList(item.name,item.key,self.appId)
                }
            )
        },
        openCustomPage(config){
            var self_=this;
            var config = {
                curVm: this,
                widthHeight: ['800px', '600px'],
                component: CustomViewDialog,
                data:{
                    type:"drag",
                    isDefaultOpen:true
                },
            };
            if (this.appId){
                config.data.appId=this.appId
            }
            Util.open(config, function (action,data) {
                sessionStorage.removeItem("CUR_APP_ID");
                self_.func_openCustomPage(data.name,data.alias,self_.appId)
            });
        },
        selectType(val){
            this.$refs.monacoes.insertContent (val)
        },
        cancel(){
            Util.closeWindow(this,"cancel");
        },
        handOk(){
            Util.closeWindow(this,"ok",this.localVal);
        },
        getData(){
            return this.localVal;
        },

    }
}
</script>
<style scoped>

</style>

